<template>
	<view>
		<view class="login" v-show="isAuthorization">
			<view class="uni-common-mt">
				
				<view class="uni-form-item uni-column">
					<view>
					<uni-easyinput class="uni-input" type="text" v-model="user.username"hold-keyboard placeholder="用户名" ></uni-easyinput>
					</view>
				</view>
				<view class="uni-form-item uni-column">
					<view>
						<uni-easyinput class="uni-input" type="password" v-model="user.password"hold-keyboard placeholder="密码" ></uni-easyinput>
					</view>
				</view>
				<view class="uni-form-item uni-column">
					<view>
						<button type="primary" @click="login">登录</button></br>
						<button type="primary" @click="rigth">注册</button>
					</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				"isAuthorization": true,
				user:{
					username:"",
					password:""
				} 
			}
		},
		methods: {
			login(){
				uni.request({
					url:this.api.login,
					method:"POST",
					data:this.user,
					success: (res) => {
						if(res.data){
							uni.showToast({
								title: '登录成功，正在跳转',
								icon: "2000"
							})
						}
						else{
							uni.showToast({
								title: '登录失败',
								icon: "none"
							})
							this.user.password=""
						}
					},
					fail: () => {
						uni.showToast({
							title: '登录失败',
							icon: "none"
						})
						this.user.password=""
					}
				})
			},
			rigth(){
				uni.navigateTo({
					url:"../register/register"
				})
			}
		}
	}
</script>

<style lang="scss">
  .login {
		padding: 20rpx 40rpx;
		margin: 0 auto;
		margin-top: 10%;
		text-align: center;
		background-color: #eee;
		width: 350px;
		font-size: 18px;
		.login_label {
			margin-top: 10%;
			color: #333333;
			margin: 0 auto;
			width: 30px;
		}

		.uni-input {
			margin-top: 10%;
			background-color: #fff;
			height: 30rpx;
			text-align: center;
			padding-left: 10rpx;
			border-radius: 10rpx;
			width: 350px;
			font-size: 30rpx;
		}

		.uni-form-item {
			margin: 30rpx 0;
		}

		button {
			font-size: 24rpx;
			height: 60px;
		}
	}
</style> 